// reference local blank image
Ext.BLANK_IMAGE_URL = '../../resource/s.gif';

Ext.ns('com.philip.journal.login');

// create application
com.philip.journal.login = function() {

    // do NOT access DOM from here; elements don't exist yet

    // private variables
    var config;

    // private functions
    var clearError = function() {
        Ext.get('error-msg').update('');
    };

    var doSubmit = function() {
        var form = Ext.getCmp('login-form').getForm();
        if (form.isValid()) {
            form.buttons[0].disabled = true;
            form.submit({
                method : 'POST',
                waitTitle : 'Connecting',
                waitMsg : 'Authenticating user...',
                success : function(form, action) {
                    var respObj = Ext.util.JSON.decode(action.response.responseText);
                    var redirect = respObj.redirect;
                    window.location = redirect;
                },
                failure : function(form, action) {
                    form.buttons[0].disabled = false;
                    if (action.failureType == 'server') {
                        var respObj = Ext.util.JSON.decode(action.response.responseText);
                        Ext.fly('error-msg').update(respObj.errors.reason);
                    } else {
                        //Ext.Msg.alert('Warning!', 'Authentication server is unreachable : ' + action.response.responseText);
                    }
                    //Ext.getCmp('login-form').getForm().reset();
                }
            });
        }
    };

    // public space
    return {

        // public properties, e.g. strings to translate

        // public methods
        constructor : function(p_config) {
            config = p_config;
        },

        init : function() {
            Ext.QuickTips.init();

            Ext.form.Field.prototype.msgTarget = 'side';

            var loginForm = {
                xtype : 'form',
                id : 'login-form',
                waitTitle : 'Connecting',
                waitMsg : 'Sending data...',

                bodyStyle : 'padding:15px;background:transparent',
                border : false,
                url : './login',
                items : [ {
                    xtype : 'textfield',
                    id : 'login-user',
                    fieldLabel : 'Username',
                    allowBlank : false,
                    blankText : 'Enter your username',
                    //validationEvent : false,
                    autoCreate : {
                        tag : 'input',
                        type : 'text',
                        size : '20',
                        autocomplete : 'off',
                        maxlength : '16'
                    },
                    listeners : {
                        specialkey : function(f, e) {
                            if (e.getKey() == e.ENTER) {
                                doSubmit();
                            }
                        },
                        focus : function() {
                            clearError();
                        }
                    }
                }, {
                    xtype : 'textfield',
                    id : 'login-pwd',
                    fieldLabel : 'Password',
                    inputType : 'password',
                    validationEvent : false,
                    allowBlank : true,
                    autoCreate : {
                        tag : 'input',
                        type : 'password',
                        size : '20',
                        autocomplete : 'off',
                        maxlength : '16'
                    },
                    listeners : {
                        specialkey : function(f, e) {
                            if (e.getKey() == e.ENTER) {
                                doSubmit();
                            }
                        },
                        focus : function() {
                            clearError();
                        }
                    }
                }, {
                    xtype : 'box',
                    id : 'error-msg',
                    itemCls : 'error-msg',
                    autoEl : {
                        tag : 'div',
                        style : 'color : red;'
                    }
                } ],
                buttonAlign : 'center',
                buttons : [ {
                    text : 'Login',
                    handler : function() {
                        doSubmit();
                    },
                    disabled : false,
                    icon : 'login/resource/login.gif'
                } ],
                bbar : {}
            }

            var win = new Ext.Window({
                layout : 'form',
                title : 'Authorization Required',
                width : 320,
                autoHeight : true,
                closable : false,
                items : [ loginForm ],
                bbar : {
                    xtype : 'toolbar',
                    items : [ {
                        xtype : 'tbfill'
                    }, 'Version: ' + config.version ],
                    height : 20
                }
            });
            win.show();
        }// end of init()
    };
}(); // end of app

// end of file

